<template>
  <div>
      <h2>{{num}}</h2>
      <button @click="increment(2)">+2</button>
      <button @click="decrement" data-step='3'>-3</button>
      <button @click="incrementN($event,4)" max-val='50'>+4</button>
  </div>
</template>

<script>
export default {
  data(){
    return{
      num:0
    }
  },
  methods:{
    increment(step){
      this.num+=step
    },
    decrement(e){
      this.num-=~~e.target.getAttribute('data-step')
    },
    incrementN(e,step){
      if(this.num<~~e.target.getAttribute('max-val')){
        this.num+=step
      }else{
        window.alert('数据超过50')
      }
    }

  }
}
</script>

<style>

</style>